@media only screen and (min-width : 1224px) {
	body {
		font-family: Verdana, Geneva, sans-serif;
		font-size: 11px;
	}
	img {
		border: 0;
	}
	h2 {
		font-family: Verdana, Geneva, sans-serif;
		font-size: 14px;
	}
	.login {
		position: absolute;
		top: 50%;
		left: 50%;
		margin-top: -100px;
		margin-left: -100px;
	}
	.header {
		width: 100%;
		/*background: #eff2f5; */
	}
	.main {
		margin-lef: 5px;
		margin-top: 5px;
		width: 100%;
	}
	#info {
		display: none;
		margin: 0px 0px 0 0px;
		margin-top: 20px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		background: #F5F3BA url(images/icn_alert_warning.png) no-repeat;
		background-position: 0px 0px;
		border: 1px solid #C7A20D;
		color: #796616;
		padding: 5px 0;
		text-indent: 20px;
		font-size: 11px;
	}
	table,td {
		font: 100% Arial, Helvetica, sans-serif;
	}
	table {
		width: 100%;
		border-collapse: collapse;
		margin: 1em 0;
	}
	th,td {
		text-align: left;
		padding: .5em;
		border: 1px solid #fff;
	}
	th {
		border: 1px solid #4297d7;
		background: #5c9ccc url(images/ui-bg_gloss-wave_55_5c9ccc_500x100.png)
			50% 50% repeat-x;
		color: #ffffff;
		font-weight: bold;
		/*background: #328aa4 url(tr_back.gif) repeat-x;
	color: #fff;*/
		text-align: center;
	}
	td {
		background: #e5f1f4;
	}

	/* tablecloth styles */
	tr.even td {
		background: #e5f1f4;
	}
	tr.odd td {
		background: white;
	}
	th.over,tr.even th.over,tr.odd th.over {
		background: #4a98af;
	}
	th.down,tr.even th.down,tr.odd th.down {
		background: #bce774;
	}
	th.selected,tr.even th.selected,tr.odd th.selected {
		
	}
	td.over,tr.even td.over,tr.odd td.over {
		background: #ecfbd4;
	}
	td.down,tr.even td.down,tr.odd td.down {
		background: #bce774;
		color: #fff;
	}
	td.selected,tr.even td.selected,tr.odd td.selected {
		background: #bce774;
		color: #555;
	}

	/* use this if you want to apply different styleing to empty table cells*/
	td.empty,tr.odd td.empty,tr.even td.empty {
		background: #fff;
	}

	/* CONFIGURACION DEL MENU */
	.menu {
		background: #5696C1;
		/* height: 35px; */
		margin: 0px;
		padding: 0px 0px;
		width: auto;
	}
	.menu li,.menu li a {
		display: inline;
		/*aplica el haslayout para IE6 asi evitamos el doble margen a elementos flotados*/
		float: left;
		/*Importante para que todas nuestras listas, esten en una misma linea*/
		width: auto;
	}
	.menu li {
		margin: 0px 5px 0px 0px;
		position: relative; /*Importante para el submenu pero por ahora no*/
	}
	.menu li a { /*background:url(bg_mn_a.gif);*/
		color:#5c9ccc;
		font-family: Verdana, Geneva, sans-serif;
		font-size: 11px;
		height: 25px;
		padding: 10px 0px 0px 5px;
		margin-top: 0px;
	}
	.menu li a:hover {
		background-position: 0 50px;
		/*Usuamos una sola imagen y al pasar el cursor se baja el fondo 50px para hacer el efecto sin JS*/
		background:#5c9ccc;
		color: #FFF;
	}
}

@media screen and (min-width: 320px) {
	.header {
		float: top;
		width: 100%;
		/*background: #eff2f5; */
	}
	.main {
		float: left;
		margin-lef: 5px;
		margin-top: 5px;
		width: 100%px;
	}
	table,td {
		font: 100% Arial, Helvetica, sans-serif;
	}
	table {
		border-collapse: collapse;
		margin: 1em 0;
	}
	th,td {
		text-align: left;
		padding: .5em;
		border: 1px solid #fff;
	}
	th {
		border: 1px solid #4297d7;
		background: #5c9ccc url(images/ui-bg_gloss-wave_55_5c9ccc_500x100.png)
			50% 50% repeat-x;
		color: #ffffff;
		font-weight: bold;
		text-align: center;
	}
	td {
		background: #e5f1f4;
	}

	/* tablecloth styles */
	tr.even td {
		background: #e5f1f4;
	}
	tr.odd td {
		background: white;
	}
	th.over,tr.even th.over,tr.odd th.over {
		background: #4a98af;
	}
	th.down,tr.even th.down,tr.odd th.down {
		background: #bce774;
	}
	th.selected,tr.even th.selected,tr.odd th.selected {
		
	}
	td.over,tr.even td.over,tr.odd td.over {
		background: #ecfbd4;
	}
	td.down,tr.even td.down,tr.odd td.down {
		background: #bce774;
		color: #fff;
	}
	td.selected,tr.even td.selected,tr.odd td.selected {
		background: #bce774;
		color: #555;
	}

	/* use this if you want to apply different styleing to empty table cells*/
	td.empty,tr.odd td.empty,tr.even td.empty {
		background: #fff;
	}
	/* CONFIGURACION DEL MENU */
	.menu {
		background: #5696C1;
		/* height: 35px; */
		margin: 0px;
		padding: 0px 0px;
		width: auto;
	}
	.menu li,.menu li a {
		display: inline;
		/*aplica el haslayout para IE6 asi evitamos el doble margen a elementos flotados*/
		float: left;
		/*Importante para que todas nuestras listas, esten en una misma linea*/
		width: auto;
	}
	.menu li {
		margin: 0px 5px 0px 0px;
		position: relative; /*Importante para el submenu pero por ahora no*/
	}
	.menu li a { /*background:url(bg_mn_a.gif);*/
		color:#5c9ccc;
		font-family: Verdana, Geneva, sans-serif;
		font-size: 11px;
		height: 25px;
		padding: 10px 0px 0px 5px;
		margin-top: 0px;
	}
	.menu li a:hover {
		background-position: 0 50px;
		/*Usuamos una sola imagen y al pasar el cursor se baja el fondo 50px para hacer el efecto sin JS*/
		background:#5c9ccc;
		color: #FFF;
	}
}